.ProfessionBaike {
  --tabs-active-color: #5278fd;
  --tab-color: #666666;
  --tab-font-size: 28px;
  --tab-active-color: #333333;
  --tab-active-font-weight: 500;
  --tabs-wrap-height: 76px;
  --tabs-line-height: 76px;
  --tabs-bottom-bar-width: 48px;
  --tabs-bottom-bar-height: 4px;
  @apply box-border;
}
.main {
  height: calc(100vh - 76px);
  @apply box-border overflow-hidden flex flex-row w-page bg-sky-500;
}
.sider {
  width: 176px;
  background-color: #f1f5f9;
  @apply h-full flex-none;
  .siderItem {
    height: 88px;
    @apply box-border flex flex-row justify-center items-center;
    .siderItemInner {
      border-left: 6px solid transparent;
      @apply w-full box-border text-bold text-28px text-center;
      &.siderItemInnerActive {
        border-color: #5278fd;
        @apply text-32px text-primary font-500;
      }
    }
  }
}
.content {
  background-color: #f7f7f7;
  @apply flex-1 box-border h-full w-0 flex flex-col;
  .categorysWrap {
    height: 104px;
    @apply box-border flex items-center flex-none;
  }
  .categorys {
    @apply box-border whitespace-nowrap;
    .categoryWrap {
      @apply inline-block mr-16px;
      &:first-child {
        margin-left: 34px;
      }
      .category {
        height: 56px;
        @apply text-gray px-24px flex flex-row justify-center items-center text-28px box-border rounded-28px bg-white;
        &.categoryActive {
          border: 2px solid #5278fd;
          background: #5278fd1a;
          @apply text-primary;
        }
      }
    }
  }
}
.cardItem {
  width: 542px;
  @apply box-border bg-white rounded-32px p-32px mb-16px;
  .cardTitle {
    @apply text-light text-28px;
  }
  .cardList {
    @apply mt-34px flex flex-col gap-24px;
  }
  .cardListItem {
    @apply box-border gap-32px flex flex-row items-center;
  }
  .image {
    width: 140px;
    height: 140px;
    @apply rounded-16px block object-cover;
  }
  .cardListItemRight {
    @apply flex flex-col gap-24px justify-center box-border flex-1;
  }
  .cardListItemTitle {
    line-height: 36px !important;
    @apply text-bold text-28px font-500 box-border;
  }
  .cardListItemDesc {
    @apply text-light text-24px;
  }
}
